推薦擴充套件

Color Highlight

這邊跟大家推薦 Color Highlight 這個擴充套件，也是我在實作的時候才發現他的實用之處，當你設置關於顏色的 variable ，他在套用到 style 的地方也會同步顯示，當你要檢查顏色相關的 property 就會方便很多囉～

h1 color 的配置也會有顏色顯示！這樣檢視修改就方便很多，不用回到原本設置 primaryColor 的那一行去看顏色

Auto Close Tag

可以自動幫你閉合 html tag，在快速寫扣的時候有個小幫手的感覺，可以加速不少！

Auto Close Tag - Visual Studio Marketplace

Auto Rename Tag

當 tag 的名稱有變時，前後的 tag 會一起幫你變動，就不用改兩次了，也是好用小幫手！

Auto Rename Tag - Visual Studio Marketplace

Bracket Pair Colorizer 2

當程式碼寫了很多行後，有時候會搞不清楚哪個 div 對應在哪個 close tag 上的情況發生，當你安裝這個套件後，就可以用顏色去區分對應的 div 區間在哪，快速找到相應的內容！

Bracket Pair Colorizer 2 - Visual Studio Marketplace

Tabnine - Code Faster with the All-Language ......

就是一款 AI 幫你寫扣的套件！

它內建的 ai 會依照你的習慣以及語法來偵測你下一行可能要寫什麼，有時候在 import 內容或是選擇 variable 的內容時挺方便的！上面的兩個 tag 系列也是他們家出的～

Tabnine - Code Faster with the All-Language AI Assistant for Code Completion, autocomplete JavaScript, Python, TypeScript, PHP, Go, Java, node.js, Ruby, C/C++, HTML/CSS, C#, Rust, SQL, Bash, Kotlin, R - Visual Studio Marketplace

以上是我覺得在編寫前端 or SASS 的套件們，大家如果也有其他不錯的套件想分享給我也可以在下方留言～

完賽感言

終於完成實作的部分，很抱歉後面越寫越大塊，前面 header 拆分的節奏感覺還不錯，但是沒想到還是塞不完後半部ＱＱ，如果下次有再參賽會在注意節奏的！而剩下的內容我會再做調整，歡迎關注我的 GitHub <3

最後，感謝 47 找我寫鐵人賽，感謝大家有乖乖寫完，真的是太熱血了，整整一個月回家都沒在看小說而是寫扣（好累⋯⋯，呼，我現在只想回家看小說啦ＱＱ